import { selectByUseId } from '@/services/banned';
import { selectGoods } from '@/services/commodity';
import { selectPreById, selectPreByName } from '@/services/coupons';
import { selectOrder } from '@/services/orders';
import { selectByGoodsid } from '@/services/stock';
import { selectById } from '@/services/user';
import { selectWriteById, selectWriteByName } from '@/services/write';
import { colorStr } from '@/utils/utils';
import { Dropdown, Input, Menu } from 'antd';
import { useState } from 'react';
import styles from './index.less';

interface Props {
  searchText: string;
  fromWhere: string;
  currentPage?: any;
  selected: (value: any) => void;
  clear: () => void;
}

const SelectOne: React.FC<Props> = ({ searchText, fromWhere, selected, clear, currentPage }) => {
  const { Search } = Input;
  const [search, setSearch] = useState<string>('');
  const [menuKeyPre, setMenuKeyPre] = useState<string>('1');
  const [menuKeyAdvice, setMenuAdvice] = useState<string>('1');
  const selectSome = async (value: string) => {
    switch (fromWhere) {
      case 'user':
        try {
          await selectById({ id: value, role: '1' }).then((res) => {
            selected([res]);
          });
        } catch (error) {
          console.log(error);
        }
        break;
      case 'sale':
        try {
          await selectById({ id: value, role: '2' }).then((res) => {
            selected([res]);
          });
        } catch (error) {
          console.log(error);
        }
        break;
      case 'banned':
        try {
          await selectByUseId({ userid: value }).then((res) => {
            selected(res.list);
          });
        } catch (error) {
          console.log(error);
        }
        break;
      case 'notice':
        try {
          menuKeyAdvice === '1'
            ? await selectWriteById({ id: value }).then((res) => {
                selected(res);
              })
            : await selectWriteByName({ title: value }).then((res) => {
                selected(res);
              });
        } catch (error) {
          console.log(error);
        }
        break;
      case 'goods':
        try {
          await selectGoods({ id: value }).then((res) => {
            selected([res]);
          });
        } catch (error) {
          console.log(error);
        }
        break;
      case 'order':
        try {
          await selectOrder({ id: value }).then((res) => {
            selected([res]);
          });
        } catch (error) {
          console.log(error);
        }
        break;
      case 'goodsRecord':
        try {
          await selectByGoodsid({ goodsid: value }).then((res) => {
            selected(res);
          });
        } catch (error) {
          console.log(error);
        }
        break;
      case 'pre':
        try {
          menuKeyPre === '1'
            ? await selectPreById({ id: value, pageIndex: currentPage }).then((res) => {
                selected(res.list);
              })
            : await selectPreByName({ name: value, pageIndex: currentPage }).then((res) => {
                selected(res.list);
              });
        } catch (error) {
          console.log(error);
        }
        break;
      default:
        break;
    }
  };
  const onSearch = (value: string) => {
    selectSome(value);
  };
  const menuPre = (
    <Menu>
      <Menu.Item key={'1'}>
        <div
          onClick={() => {
            setMenuKeyPre('1');
          }}
        >
          优惠券编号
        </div>
      </Menu.Item>
      <Menu.Item key={'2'}>
        <div
          onClick={() => {
            setMenuKeyPre('2');
          }}
        >
          活动名称
        </div>
      </Menu.Item>
    </Menu>
  );
  const menuAdvice = (
    <Menu>
      <Menu.Item key={'1'}>
        <div
          onClick={() => {
            setMenuAdvice('1');
          }}
        >
          资讯编号
        </div>
      </Menu.Item>
      <Menu.Item key={'2'}>
        <div
          onClick={() => {
            setMenuAdvice('2');
          }}
        >
          资讯名称
        </div>
      </Menu.Item>
    </Menu>
  );

  return (
    <div className={styles.container}>
      {fromWhere === 'pre' ? (
        <div className={styles.preSearch}>
          <Dropdown overlay={menuPre} placement="bottom">
            <div className={styles.dropSelect} style={{ backgroundColor: colorStr(6), width: 70 }}>
              {menuKeyPre === '1' ? `优惠券编号` : `活动名称`}
            </div>
          </Dropdown>
          <Search
            placeholder={menuKeyPre === '1' ? `请输入优惠券编号` : `请输入活动名称`}
            onSearch={onSearch}
            onChange={(e) => {
              setSearch(e.target.value);
            }}
            value={search}
            style={{
              width: 391,
              border: `1px solid ${colorStr(6)}`,
              borderRadius: 6,
              color: `${colorStr(9)}`,
            }}
          />
        </div>
      ) : fromWhere === 'notice' ? (
        <div className={styles.preSearch}>
          <Dropdown overlay={menuAdvice} placement="bottom">
            <div className={styles.dropSelect} style={{ backgroundColor: colorStr(6), width: 71 }}>
              {menuKeyAdvice === '1' ? `资讯编号` : `资讯名称`}
            </div>
          </Dropdown>
          <Search
            placeholder={menuKeyAdvice === '1' ? `请输入资讯编号` : `请输入资讯名称`}
            onSearch={onSearch}
            onChange={(e) => {
              setSearch(e.target.value);
            }}
            value={search}
            style={{
              width: 391,
              border: `1px solid ${colorStr(6)}`,
              borderRadius: 6,
              color: `${colorStr(9)}`,
            }}
          />
        </div>
      ) : (
        <Search
          placeholder={`请输入${searchText}`}
          onSearch={onSearch}
          onChange={(e) => {
            setSearch(e.target.value);
          }}
          value={search}
          style={{
            width: 391,
            border: `1px solid ${colorStr(6)}`,
            borderRadius: 6,
            color: `${colorStr(9)}`,
          }}
        />
      )}
      <div
        style={{ color: colorStr(9), marginLeft: 20, cursor: 'pointer' }}
        onClick={() => {
          setSearch('');
          clear();
        }}
      >
        清空搜索
      </div>
    </div>
  );
};
export default SelectOne;
